.qux-date {
    overflow: hidden;

    .qux-date-header {
        display: flex;
        width: 100%;
        height: 15%;
        font-size: 120%;

        .qux-date-header-btn {
            position: relative;
            width: 15%;
            text-align: center;
            cursor: pointer;
        }

        .qux-date-header-label {
            position: relative;
            text-align: center;
            flex-grow: 1;
        }
    }

    .qux-date-header-label .qux-common-valign-center{
        width: 100%;
    }

    .qux-date-body {
        width: 100%;
        height: 85%;
    
        table {
            width: 100%;
            height: 100%;
            border-spacing: 0;
            border-collapse: collapse;
            text-align: center;
        }
        
        th, td {
            padding: 5px;
            width: 14.3%;
        }

        td {
            cursor: pointer;
        }

        .qux-date-selected,
        .qux-date-range-start,
        .qux-date-range-end {
            background: #333;
            color: #fff;
        }
        .qux-date-range-middle {
            background: #555;
            color: #fff;
        }
    }



    
}